<!-- <div class="navbar navbar-fixed-top">

	<div class="navbar-inner">
		<div class="container">
			<a class="brand" href="#"></a>
			<ul class="nav">

				<li>
					<a href="<?php echo "http://" . $_SERVER["HTTP_HOST"] . "/sistema"; ?>"><i class="icon-th"></i> Menu</a>
				</li>
				<li>
					<a href="<?php echo "http://" . $_SERVER["HTTP_HOST"] . "/sair"; ?>"><i class="icon-remove-circle"></i> Sair</a>
				</li>
			</ul>
		</div>
	</div>
</div> -->
<?php include ('menu.php'); ?>
<div id="container">
	<form lass="form-horizontal" id="formulario" method="post" action="<?php echo "http://" . $_SERVER["HTTP_HOST"] . "/cadastrar"; ?>">
		<div class='marca_form'><img class="thumbnail" src="view/imagens/logo.png" width="60px" />
		</div>
		<br>
		<br>
		<br>
		<h4>Formulário de inscrição voluntário</h4>

		<ul id="tabs" class="nav nav-tabs" data-tabs="tabs">
			<li class="active">
				<a href="#red" >Dados Pessoais</a>
			</li>
			<li>
				<a href="#orange" >Dados Profissionais</a>
			</li>
			<li>
				<a href="#yellow" >Dados Voluntariado</a>
			</li>
			<li>
				<a href="#blue" >Horários disponíveis</a>
			</li>

		</ul>
		<div id="my-tab-content" class="tab-content">
			<div class="tab-pane active" id="red">

				<span class="form-horizontal">
					<div class="control-group">
						<label class="control-label" for="inputNome">Nome</label>
						<div class="controls">
							<input name="nome" type="text" required placeholder="Ex: João Paulo.">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">E-mail</label>
						<div class="controls">
							<input name="email" type="email" required placeholder="Ex: Joaopaulo@gmail.com.">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Endereço</label>
						<div class="controls">
							<input name="endereco" type="text" required placeholder="Ex: Rua Joaquim Santiago nº123">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">CEP</label>
						<div class="controls">
							<input name="cep" id="cep" type="text" required placeholder="Ex: 50609-340">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">CPF</label>
						<div class="controls">
							<input name="cpf" id="cpf" type="text"  required placeholder="Ex: 049.257.874-54">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Data de Nascimento</label>
						<div class="controls">
							<input name="dataNascimento" id="dataNascimento" type="date" required placeholder="Ex: 20/10/2013">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">RG</label>
						<div class="controls">
							<input name="rg" id="rg" type="text" required placeholder="Ex: 6.347.952">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Orgão
							<br>
							Expeditor/UF</label>
						<div class="controls">
							<input name="rgOrgaoExpeditor" type="text" id="expedidor"  required placeholder="Ex: SDS/PE">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Nome da Mãe</label>
						<div class="controls">
							<input name="nomeMae" id="nomeMae" type="text" placeholder="Ex: Maria josé">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Telefone Residencial</label>
						<div class="controls">
							<input name="telefoneResidencial" id="fone" type="text" placeholder="Ex: (081)8824-9876">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Telefone Celular</label>
						<div class="controls">
							<input name="telefoneCelular" id="fone2" type="text" required="required" placeholder="Ex: (081)3224-9876">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Renda Familiar</label>
						<div class="controls">
							<select id="renda" name="rendaFamilar">
								<option></option>
								<?php echo $classeSaida -> rendas; ?>
								<option>Outro Valor</option>
							</select></td>
						</div>
					</div>
					<div class="outroValor control-group info">
						<label class="control-label" for="inputWarning">Digite o valor:</label>

						<div class="controls">
							<input name="outraRenda" type="text" id="inputWarning" size="15px">

						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Numero de Pessoas
							<br />
							na Residência:</label>
						<div class="controls">
							<input name="numeroPessoasResidencia" type="text" required placeholder="Ex: 2">
						</div>
					</div> </span>

			</div>
			
			<div class="tab-pane" id="orange">
				<span class="form-horizontal">
					<div class="control-group">
						<label class="control-label" for="inputEmail">Formação Educacional</label>
						<div class="controls">
							<select name="formacaoEducacional" required>
								<option>1° grau</option>
								<option>2° grau</option>
								<option>3° grau</option>
							</select>
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputCurso">Curso</label>
						<div class="controls">
							<select name="curso">
								<?php echo $classeSaida -> cursos; ?>
							</select>
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputExperienciaProfissional">Ultima Experiência Profissional</label>
						<div class="controls">
							<input name="ultimaExperianciaProfissional" type="text" placeholder="Ex: Vendedor">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputPeriodoIncial">Período Inicio:</label>
						<div class="controls">
							<input name="experienciaPeriodoInicio" type="date" id="data" >
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputExperienciaPeriodoFinal">Período Final:</label>
						<div class="controls">
							<input id="experienciaPeriodoFinal" name="experienciaPeriodoFinal" type="date" id="data" >
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputAtividadesDesenvolvidas">Atividades Desenvolvidas</label>
						<div class="controls">
							<textarea name="atividadesDesenvolvidas" cols="60" rows="5"></textarea>
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputContato">Contato</label>
						<div class="controls">
							<input name="contato" type="text" placeholder="Ex: Mária Lurdes">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Área</label>
						<div class="controls">
							<input name="atividadeVoluntarioaArea" type="text" placeholder="Ex: Vendas">
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Cargo</label>
						<div class="controls">
							<input name="atividadeVoluntarioaCargo" type="text" placeholder="Ex: Vendedor">
						</div>
					</div> </span>

			</div>
			<div class="tab-pane" id="yellow">
				<span class="form-horizontal">
					<div class="control-group">
						<label class="control-label" for="inputEmail">Por que escolheu o
							<br>
							Movimento Pró-Criança?</label>
						<div class="controls">
							<textarea name="motivoRPV" cols="60" rows="5" required></textarea>
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Expectativas em relação á
							<br>
							Instituição e ao Trabalho
							<br>
							voluntário a ser desempenhado</label>
						<div class="controls">
							<textarea name="expectativas" cols="60" rows="5" required></textarea>
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="inputEmail">Já teve alguma experiência em
							<br>
							outra instituição?Se sim,qual,
							<br>
							por quanto tempo e qual a função?</label>
						<div class="controls">
							<textarea name="descExperianciaVoluntariaAnterior" cols="60" rows="5" required></textarea>
						</div>
					</div>
					</span>
					
			</div>
			<!--  -->
			<div class="tab-pane" id="blue">
				<span class="form-horizontal">

				
					<div class="control-group">
						<label class="control-label">Dia </label>
						<div class="controls">
							<select id="selectDia" name="opt">
								<option>Seg</option>
								<option>Ter</option>
								<option>Qua</option>
								<option>Qui</option>
								<option>Sex</option>
								<option>Sab</option>
								<option>Dom</option>
							</select>
						</div>
					</div>
					
					<div class="control-group">
						<label class="control-label">Hora Inicial</label>
						<div class="controls">
							<input id="horaInicial" name="horaInicial" type="text" size="5px" required >
						</div>
					</div>
					<div class="control-group">
						<label class="control-label">Hora Final </label>
						<div class="controls">
							<input id="horaFinal" name="horaFinal" type="text" size="5px" required >
						</div>
					</div>
					<div class="control-group">
						<div class="controls">
							<input id="atualiza" class="btn btn-small "  type="button" value="adicionar a grade">
							<input id="limpa" class="btn btn-small "  type="button" value="limpar a grade">
							<!--<input id="help" class="btn btn-small "  type="button" value="limpar a grade">-->
							<a class="btn btn-small help" href="#"><i class=" icon-question-sign"></i></a>
						</div>
					</div> 
					<div class="control-group">
						<label class="control-label gradecolor">Grade de horário </label>
						<div class="controls">
							<div class="grade">
								<table id="table" class="table"></table>
						</div>		
						</div>
					</div> 
					
					<div class=" controls">
						<a href="<?php echo "http://" . $_SERVER["HTTP_HOST"] . "/sistema"; ?>">
						<input class="btn" type="button" value="Voltar">
						</a>
						<input class="btn btn-primary .btn-block" type="submit" id="submit" value="Enviar Dados"> 
					</div> </span>
				</form>

			</div>

		</div>
	<!-- </form> -->
</div>
<!-- modal -->

 

<div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h5 id="myModalLabel">Como adicionar horários na grade?</h5>
  </div>
  <div class="modal-body">
    <p>Para montar sua grade,  selecione o dia da semana e inclua o horário inicial e o horário final do voluntário
    <br>Depois disso clique no botão "adicionar a grade", depois de incluído um dia da semana não é 
    permitido adiciona-lo novamente. 
    <br><br>Para limpar a grade, clique no botão "limpar grade".</p>
  </div>
  <div class="modal-footer">
    
  </div>
</div>

<style>
	.outroValor {
		display: none;
	}
	/* liberar barra de rolagem*/
	html {
		overflow-y: scroll;
	}
	html {
		overflow: -moz-scrollbars-vertical;
	}
	html {
		overflow-x: auto;
	}
	#table input {
		border: solid 2px #fff;
		color:#2d6987 !important;
	}
	#table {
		width:170px !important;
		
		
		
	}
	.gradecolor{
		color:#2d6987;
	}
	.grade{
		border: 1px solid #2d6987;
padding: 2px;
width: 309px;
border-radius: 4px;
min-height: 100px;
	}
	.table td {
padding: 2px !important;
line-height: 0px !important;
text-align: left !important;
vertical-align: top !important;
border-top: 0px solid #fff !important;

}
.modal{
	display:none;
}
</style>